<template>
  <div>
    <div id="ToRemind-title">待办提醒</div>
    <div class="ToRemind-main" v-for="(obj,index) in list" :key="index">
      <p class="ToRemind-text01"> {{ obj.count }} </p>
      <p class="ToRemind-text02"> {{ obj.title }} </p>
      <div class="dot"></div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
axios.defaults.baseURL = "http://localhost:8080"
export default {  
  created(){
    axios({
      url:"/data/getToremind",
      method:"get"
    }).then((res) =>{
      this.list = res.data
    })
  },
  data() {
    return {
      list:[]
    }
  },

}
</script>

<style>
    #ToRemind-title{
        width: 100%;
        height: 40px;
        line-height: 40px;
        margin-bottom: 8px;
    }
    .ToRemind-main{
      width: 100%;
      height: 75px;
      border-top: 1px solid rgb(216, 216, 216);
      padding: 10px 10px;
      box-sizing: border-box;
      position: relative;
    }
    .ToRemind-text01{
      font-size: 19px;
    }
    .ToRemind-text02{
      font-size: 13px;
      color: rgb(161, 161, 161);
      margin-top: 10px;
    }
    .dot{
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #FF6262;
      position: absolute;
      top: 30px;
      right: 10px;
    }
</style>